﻿<UserControl x:Class="navigation.Controls.SlideSwitch"
             xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
             xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
             xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006" 
             xmlns:d="http://schemas.microsoft.com/expression/blend/2008" 
             xmlns:s="http://schemas.microsoft.com/surface/2008"
             mc:Ignorable="d" 
             d:DesignHeight="100" d:DesignWidth="400">
    <UserControl.Resources>
        <!-- public section -->
        <SolidColorBrush x:Key="ControlHitAreaBrush"    
			Color="#00FFFFFF"/>

        <!-- Minimum HitArea Base Style for 55 dpi-->
        <Style x:Key="SurfaceHitAreaBaseStyle"
			TargetType="{x:Type Control}">
            <Setter Property="SnapsToDevicePixels"
				Value="False"/>
            <Setter Property="Background"
				Value="{StaticResource ControlHitAreaBrush}"/>
            <Setter Property="IsTabStop"
				Value="False"/>
            <Setter Property="Focusable"
				Value="False"/>
            <Setter Property="FocusVisualStyle"
				Value="{x:Null}"/>
            <Setter Property="MinWidth"
				Value="40" />
            <Setter Property="MinHeight"
				Value="40" />
        </Style>

        <!-- Slider tooltip
    We provide our own custom implementation of auto-tooltips for SurfaceSlider. Our "tooltip"
    is actually a WPF control, which allows tighter coupling to the position/orientation of
    the slider than if it were a separate window, as is the case with "real" tooltips.-->
        <Style x:Key="SliderToolTipStyle"
			TargetType="{x:Type Label}">
            <Setter Property="Visibility"
				Value="Collapsed"/>
            <Setter Property="ClipToBounds"
				Value="False"/>
            <Setter Property="Background"
				Value="{DynamicResource {x:Static s:SurfaceColors.ToolTipBackgroundBrushKey}}"/>
            <Setter Property="Foreground"
				Value="{DynamicResource {x:Static s:SurfaceColors.ToolTipForegroundBrushKey}}"/>
            <Setter Property="Padding"
				Value="5,2,5,3"/>
            <Setter Property="Template">
                <Setter.Value>
                    <ControlTemplate TargetType="{x:Type Label}">
                        <Grid Background="{DynamicResource {x:Static s:SurfaceColors.ButtonBackgroundBrushKey}}" >
                            <Border						  
								HorizontalAlignment="Stretch"                          
								Background="{TemplateBinding Background}"                   
								Opacity="{TemplateBinding Opacity}">
                                <TextBlock
									Margin="{TemplateBinding Padding}"
									Foreground="{TemplateBinding Foreground}"                            
									Text="{TemplateBinding Content}"/>
                            </Border>
                        </Grid>
                    </ControlTemplate>
                </Setter.Value>
            </Setter>
        </Style>

        <Style x:Key="SliderHorzDecreaseRepeatButtonStyle"
			TargetType="{x:Type s:SurfaceRepeatButton}" >
            <Setter Property="Interval"
				Value="150"/>
            <Setter Property="OverridesDefaultStyle" 
				Value="True"/>
            <Setter Property="IsTabStop" 
				Value="False"/>
            <Setter Property="Focusable" 
				Value="False"/>
            <Setter Property="Template" >
                <Setter.Value>
                    <ControlTemplate TargetType="{x:Type s:SurfaceRepeatButton}">
                        <Grid Background="{StaticResource ControlHitAreaBrush}" MinHeight="38" MaxHeight="38" Margin="0,0,37.5,0">
                            <Rectangle x:Name="Left" VerticalAlignment="Top"
								Margin="1,13.676,0,0"	
								MinHeight="2" Width="Auto" Height="2.167" d:LayoutOverrides="HorizontalMargin">
                                <Rectangle.Fill>
                                    <LinearGradientBrush EndPoint="-0.02,0.448" StartPoint="0.946,0.5">
                                        <GradientStop Color="#FF0C70F5" Offset="0"/>
                                        <GradientStop Color="White" Offset="1"/>
                                        <GradientStop Color="White"/>
                                        <GradientStop Color="#FF046FFB"/>
                                        <GradientStop Color="#FF0467FB"/>
                                        <GradientStop Color="White" Offset="0.991"/>
                                    </LinearGradientBrush>
                                </Rectangle.Fill>
                            </Rectangle>
                        </Grid>
                    </ControlTemplate>
                </Setter.Value>
            </Setter>
        </Style>

        <!-- Simple Slider RepeatButton -->
        <Style x:Key="SliderHorzIncreaseRepeatButtonStyle"
			TargetType="{x:Type s:SurfaceRepeatButton}" >
            <Setter Property="Interval"
				Value="150"/>
            <Setter Property="OverridesDefaultStyle" 
				Value="True"/>
            <Setter Property="IsTabStop" 
				Value="False"/>
            <Setter Property="Focusable" 
				Value="False"/>
            <Setter Property="Template">
                <Setter.Value>
                    <ControlTemplate TargetType="{x:Type s:SurfaceRepeatButton}">
                        <Grid Background="{StaticResource ControlHitAreaBrush}" MinHeight="38" MaxHeight="38">
                            <Rectangle  VerticalAlignment="Top"
								Margin="39.5,14,1,0"
								MinHeight="2">
                                <Rectangle.Fill>
                                    <LinearGradientBrush EndPoint="1.011,0.455" StartPoint="0.107,0.731">
                                        <GradientStop Color="#FF1673EF" Offset="0"/>
                                        <GradientStop Color="White" Offset="1"/>
                                    </LinearGradientBrush>
                                </Rectangle.Fill>
                            </Rectangle>
                        </Grid>
                    </ControlTemplate>
                </Setter.Value>
            </Setter>
        </Style>

        <!-- Surface Thumb -->
        <Style x:Key="SurfaceThumbStyle"
			TargetType="{x:Type s:SurfaceThumb}"
			BasedOn="{StaticResource SurfaceHitAreaBaseStyle}">
            <Setter Property="s:TouchVisualizer.Adapter">
                <Setter.Value>
                    <s:RectangleTouchVisualizerAdapter RadiusX="15"
						RadiusY="15"/>
                </Setter.Value>
            </Setter>
            <Setter Property="MinHeight" Value="6"/>
            <Setter Property="MinWidth" Value="6"/>
            <Setter Property="Template">
                <Setter.Value>
                    <ControlTemplate TargetType="{x:Type s:SurfaceThumb}">
                        <ControlTemplate.Resources>
                            <!-- Horizontal orientation -->
                            <Storyboard x:Key="Touch"/>
                            <Storyboard x:Key="Release"/>
                        </ControlTemplate.Resources>
                        <Grid x:Name="Grid" >
                            <Rectangle x:Name="HitArea"                           
								HorizontalAlignment="Stretch"
								VerticalAlignment="Stretch"
								Width="38" 
								Height="38" 
								Margin="-18,0,-18,0"						   
								Fill="{StaticResource ControlHitAreaBrush}" />
                            <Grid x:Name="Thumb" HorizontalAlignment="Stretch" Height="Auto" Margin="-36.333,-26.441,-37,-24.225" VerticalAlignment="Stretch" Width="Auto">
                                <Ellipse Fill="{StaticResource ControlHitAreaBrush}" Margin="0">
                                    <Ellipse.Stroke>
                                        <LinearGradientBrush EndPoint="0.5,1" StartPoint="0.5,0">
                                            <GradientStop Color="#FF0D87F9" Offset="0"/>
                                            <GradientStop Color="#FF0C83F1" Offset="1"/>
                                            <GradientStop Color="#FFEFF3F7" Offset="0.237"/>
                                            <GradientStop Color="#FFF3F4F5" Offset="0.728"/>
                                        </LinearGradientBrush>
                                    </Ellipse.Stroke>
                                </Ellipse>
                                <TextBlock Margin="19.667,2.668,8.999,14.332" TextWrapping="Wrap" TextAlignment="Center" FontFamily="Lucida Calligraphy" FontSize="64" FontWeight="Bold" FontStyle="Italic">
									<TextBlock.Foreground>
										<LinearGradientBrush EndPoint="0.5,1" StartPoint="0.5,0">
											<GradientStop Color="White" Offset="0"/>
											<GradientStop Color="White" Offset="1"/>
											<GradientStop Color="#FE0090FF" Offset="0.284"/>
											<GradientStop Color="#FE048FF9" Offset="0.69"/>
										</LinearGradientBrush>
									</TextBlock.Foreground><Run Language="en-nz" Text="S"/></TextBlock>
                            </Grid>
                        </Grid>
                        <ControlTemplate.Triggers>
                            <Trigger Property="s:TouchExtensions.AreAnyInputDevicesCapturedWithin"
								Value="True">
                                <Trigger.EnterActions>
                                    <BeginStoryboard Storyboard="{StaticResource Touch}" />
                                </Trigger.EnterActions>
                                <Trigger.ExitActions>
                                    <BeginStoryboard Storyboard="{StaticResource Release}" />
                                </Trigger.ExitActions>
                            </Trigger>
                            <Trigger Property="IsEnabled"
								Value="False"/>
                        </ControlTemplate.Triggers>
                    </ControlTemplate>
                </Setter.Value>
            </Setter>
        </Style>

        <!--Surface Slider Thumb -->
        <Style x:Key="SurfaceSliderHorzThumbStyle"
			TargetType="{x:Type s:SurfaceThumb}"
			BasedOn="{StaticResource SurfaceThumbStyle}">
            <Setter Property="MaxHeight" Value="38"/>
        </Style>


        <Style x:Key="SliderVertDecreaseRepeatButtonStyle"
			TargetType="{x:Type s:SurfaceRepeatButton}" 
			BasedOn="{StaticResource SurfaceHitAreaBaseStyle}">
            <Setter Property="Interval"
				Value="150"/>
            <Setter Property="OverridesDefaultStyle" 
				Value="True"/>
            <Setter Property="IsTabStop" 
				Value="False"/>
            <Setter Property="Focusable" 
				Value="False"/>
            <Setter Property="Template">
                <Setter.Value>
                    <ControlTemplate TargetType="{x:Type s:SurfaceRepeatButton}">
                        <Grid Background="{StaticResource ControlHitAreaBrush}" MinWidth="38" MaxWidth="38">
                            <Rectangle HorizontalAlignment="Left"
								Margin="12,1,0,1"
								MinWidth="2"
								Fill="{DynamicResource {x:Static s:SurfaceColors.SliderTrackDecreaseBackgroundBrushKey}}"/>
                        </Grid>
                    </ControlTemplate>
                </Setter.Value>
            </Setter>
        </Style>

        <Style x:Key="SliderVertIncreaseRepeatButtonStyle"
			TargetType="{x:Type s:SurfaceRepeatButton}" 
			BasedOn="{StaticResource SurfaceHitAreaBaseStyle}">
            <Setter Property="Interval"		
				Value="150"/>
            <Setter Property="OverridesDefaultStyle" 
				Value="True"/>
            <Setter Property="IsTabStop" 
				Value="False"/>
            <Setter Property="Focusable" 
				Value="False"/>
            <Setter Property="Template">
                <Setter.Value>
                    <ControlTemplate TargetType="{x:Type s:SurfaceRepeatButton}">
                        <Grid Background="{StaticResource ControlHitAreaBrush}" MinWidth="38" MaxWidth="38">
                            <Rectangle HorizontalAlignment="Left"
								Margin="12,1,0,1"
								MinWidth="2"
								Fill="{DynamicResource {x:Static s:SurfaceColors.SliderTrackIncreaseBackgroundBrushKey}}"/>
                        </Grid>
                    </ControlTemplate>
                </Setter.Value>
            </Setter>
        </Style>


        <Style x:Key="SurfaceSliderVertThumbStyle"
			TargetType="{x:Type s:SurfaceThumb}"
			BasedOn="{StaticResource SurfaceHitAreaBaseStyle}">
            <Setter Property="OverridesDefaultStyle" Value="true"/>
            <Setter Property="s:TouchVisualizer.Adapter">
                <Setter.Value>
                    <s:RectangleTouchVisualizerAdapter   RadiusX="15"
						RadiusY="15"/>
                </Setter.Value>
            </Setter>
            <Setter Property="MinHeight" Value="6"/>
            <Setter Property="MinWidth" Value="6"/>
            <Setter Property="MaxWidth" Value="38"/>
            <Setter Property="Template">
                <Setter.Value>
                    <ControlTemplate TargetType="{x:Type s:SurfaceThumb}">
                        <ControlTemplate.Resources>
                            <Storyboard x:Key="Touch">
                                <DoubleAnimation Duration="0:0:0.1"
									Storyboard.TargetName="Thumb"
									Storyboard.TargetProperty="Width" 
									To="16"/>
                                <DoubleAnimation Duration="0:0:0.1"
									Storyboard.TargetName="Thumb"
									Storyboard.TargetProperty="Height" 
									To="38"/>
                                <ThicknessAnimation Duration="0:0:0.1"
									Storyboard.TargetName="Thumb"
									Storyboard.TargetProperty="Margin"
									To="-1,-19,-1,-19" />
                            </Storyboard>
                            <Storyboard x:Key="Release">
                                <DoubleAnimation Duration="0:0:0.15"
									Storyboard.TargetName="Thumb"
									To="14"
									Storyboard.TargetProperty="Width"/>
                                <DoubleAnimation Duration="0:0:0.15"
									Storyboard.TargetName="Thumb"
									Storyboard.TargetProperty="Height"
									To="6"/>
                                <ThicknessAnimation Duration="0:0:0.15"
									Storyboard.TargetName="Thumb"
									Storyboard.TargetProperty="Margin"
									To="0,0,0,0" />
                            </Storyboard>
                        </ControlTemplate.Resources>
                        <Grid x:Name="Grid">
                            <Rectangle	x:Name="HitArea"                       
								HorizontalAlignment="Stretch"
								VerticalAlignment="Center"
								Width="38" 
								Height="38" 
								Margin="0,-19,0,-19"
								Fill="{StaticResource ControlHitAreaBrush}" />
                            <Rectangle 	x:Name="Thumb"
								Width="14"
								Height="6"
								HorizontalAlignment="Stretch"
								VerticalAlignment="Center"
								Fill="{DynamicResource {x:Static s:SurfaceColors.ThumbEnabledBrushKey}}"/>
                        </Grid>
                        <ControlTemplate.Triggers>
                            <Trigger Property="IsEnabled"
								Value="False">
                                <Setter TargetName="Thumb"
									Value="{DynamicResource {x:Static s:SurfaceColors.ThumbDisabledBrushKey}}"
									Property="Fill"/>
                            </Trigger>
                            <Trigger Property="s:TouchExtensions.AreAnyInputDevicesCapturedWithin"
								Value="True">
                                <Trigger.EnterActions>
                                    <BeginStoryboard Storyboard="{StaticResource Touch}" />
                                </Trigger.EnterActions>
                                <Trigger.ExitActions>
                                    <BeginStoryboard Storyboard="{StaticResource Release}" />
                                </Trigger.ExitActions>
                            </Trigger>
                        </ControlTemplate.Triggers>
                    </ControlTemplate>
                </Setter.Value>
            </Setter>
        </Style>

        <!--Slider
    Similiar to ScrollBar this template uses Track to layout the draggable Thumb which has an up and down repeat button
    It uses Simple SliderThumb and SimpleScrollRepeatButtonStyle for the page up and down repeat buttons -->
        <Style x:Key="SlideSwitch" TargetType="{x:Type s:SurfaceSlider}"
			BasedOn="{StaticResource SurfaceHitAreaBaseStyle}">
            <Setter Property="Stylus.IsFlicksEnabled"
				Value="False"/>
            <Setter Property="Background"
				Value="{StaticResource ControlHitAreaBrush}"/>
            <Setter Property="IsMoveToPointEnabled"
				Value="False"/>
            <Setter Property="BorderBrush"
				Value="{DynamicResource {x:Static s:SurfaceColors.SliderForegroundBrushKey}}"/>
            <Setter Property="Template">
                <Setter.Value>
                    <ControlTemplate TargetType="{x:Type s:SurfaceSlider}">
                        <!-- Horizontal Orientation -->
                        <Grid x:Name="GridRoot"
							Background="{TemplateBinding Background}"
							VerticalAlignment="Stretch"
							Height="Auto">
                            <Canvas ClipToBounds="False">
                                <Label x:Name="PART_SurfaceToolTip"
									Style="{StaticResource SliderToolTipStyle}"/>
                            </Canvas>
                            <Grid Margin="16,0,16,0" VerticalAlignment="Top" Height="28">
                                <!-- TickBar shows the ticks for Slider -->
                                <TickBar x:Name="TopTick"
									Visibility="Collapsed"                    
									Height="4"
									Placement="Top"
									Fill="{TemplateBinding BorderBrush}"                     
									ReservedSpace="0"                             
									VerticalAlignment="Top"
									IsDirectionReversed="False"/>
                                <TickBar x:Name="BottomTick"
									Visibility="Collapsed"                    
									Height="4" 
									Placement="Bottom"
									Fill="{TemplateBinding BorderBrush}"
									ReservedSpace="0"                             
									VerticalAlignment="Bottom"
									IsDirectionReversed="False"/>
                                <Canvas VerticalAlignment="Center" Margin="-1,-8,0,0" Height="50">
                                    <Rectangle x:Name="PART_SelectionRange" 
										Fill="{DynamicResource {x:Static s:SurfaceColors.SliderRangeBrushKey}}"                                    
										Height="8"
										Visibility="Hidden"/>
                                </Canvas>
                                <!-- The Track lays out the repeat buttons and thumb -->
                                <Track  x:Name="PART_Track" VerticalAlignment="Center" Margin="0,-1,0,0">
                                    <Track.DecreaseRepeatButton>
                                        <s:SurfaceRepeatButton x:Name="SliderDecrease"
											Margin="-1,0,-1,0"	
											Background="{TemplateBinding Background}"
											SnapsToDevicePixels="{TemplateBinding SnapsToDevicePixels}"
											Style="{StaticResource SliderHorzDecreaseRepeatButtonStyle}"
											Command="Slider.DecreaseLarge"/>
                                    </Track.DecreaseRepeatButton>
                                    <Track.IncreaseRepeatButton>
                                        <s:SurfaceRepeatButton x:Name="SliderIncrease" 
											Margin="-1,0,-1,0"
											Background="{TemplateBinding Background}"
											SnapsToDevicePixels="{TemplateBinding SnapsToDevicePixels}"
											Style="{StaticResource SliderHorzIncreaseRepeatButtonStyle}"
											Command="Slider.IncreaseLarge"/>
                                    </Track.IncreaseRepeatButton>
                                    <Track.Thumb>
                                        <s:SurfaceThumb  Style="{StaticResource SurfaceSliderHorzThumbStyle}"
											Background="{TemplateBinding Background}"
											SnapsToDevicePixels="{TemplateBinding SnapsToDevicePixels}"
											x:Name="Thumb" />
                                    </Track.Thumb>
                                </Track>
                            </Grid>
                        </Grid>
                        <ControlTemplate.Triggers>
                            <Trigger Property="IsSelectionRangeEnabled" 
								Value="True">
                                <Setter Property="Visibility" 
									TargetName="PART_SelectionRange" 
									Value="Visible"/>
                            </Trigger>
                            <Trigger Property="TickPlacement"
								Value="TopLeft">
                                <Setter Property="Visibility"
									Value="Visible"
									TargetName="TopTick"/>
                            </Trigger>
                            <Trigger Property="TickPlacement"
								Value="BottomRight">
                                <Setter Property="Visibility"
									Value="Visible"
									TargetName="BottomTick"/>
                            </Trigger>
                            <Trigger Property="TickPlacement"
								Value="Both">
                                <Setter Property="Visibility"
									Value="Visible"
									TargetName="TopTick"/>
                                <Setter Property="Visibility"
									Value="Visible"
									TargetName="BottomTick"/>
                            </Trigger>
                            <Trigger Property="IsEnabled"
								Value="False">
                                <Setter Property="Opacity"  
									TargetName="SliderDecrease"                              
									Value="0.25"/>
                                <Setter Property="Opacity"  
									TargetName="SliderIncrease"                              
									Value="0.5"/>
                                <Setter Property="Opacity"  
									TargetName="TopTick"                              
									Value="0.25"/>
                                <Setter Property="Opacity"  
									TargetName="BottomTick"                              
									Value="0.25"/>
                            </Trigger>
                        </ControlTemplate.Triggers>
                    </ControlTemplate>
                </Setter.Value>
            </Setter>

            <Style.Triggers>
                <!-- Vertical orientation -->
                <Trigger Property="Orientation"
					Value="Vertical">
                    <Setter Property="Template">
                        <!--Change the whole template-->
                        <Setter.Value>
                            <ControlTemplate TargetType="{x:Type s:SurfaceSlider}">
                                <Grid x:Name="GridRoot"
									Background="{TemplateBinding Background}"
									HorizontalAlignment="Stretch"
									Width="Auto">
                                    <Grid Margin="0,16,0,16" HorizontalAlignment="Left" Width="28">
                                        <TickBar x:Name="TopTick"
											Visibility="Collapsed"
											Width="4"
											Placement="Left"
											Fill="{TemplateBinding BorderBrush}"
											ReservedSpace="0"
											HorizontalAlignment="Left"
											IsDirectionReversed="False"/>
                                        <TickBar x:Name="BottomTick"
											Visibility="Collapsed"
											Width="4"
											Placement="Right"
											Fill="{TemplateBinding BorderBrush}"
											ReservedSpace="0"
											HorizontalAlignment="Right"
											IsDirectionReversed="False"/>
                                        <Canvas HorizontalAlignment="Center" Margin="-8,1,0,0">
                                            <Rectangle x:Name="PART_SelectionRange"
												Fill="{DynamicResource {x:Static s:SurfaceColors.SliderTrackIncreaseBackgroundBrushKey}}"                                                
												Width="8"
												Visibility="Hidden"/>
                                        </Canvas>
                                        <!-- The Track lays out the repeat buttons and thumb -->
                                        <Track  x:Name="PART_Track" HorizontalAlignment="Center">
                                            <Track.DecreaseRepeatButton>
                                                <s:SurfaceRepeatButton x:Name="SliderDecrease"
													Margin="0,-1,0,-1"	
													Background="{TemplateBinding Background}"
													SnapsToDevicePixels="{TemplateBinding SnapsToDevicePixels}"
													Style="{StaticResource SliderVertDecreaseRepeatButtonStyle}"
													Command="Slider.DecreaseLarge"/>
                                            </Track.DecreaseRepeatButton>
                                            <Track.IncreaseRepeatButton>
                                                <s:SurfaceRepeatButton x:Name="SliderIncrease"
													Margin="0,-1,0,-1"	
													Background="{TemplateBinding Background}"
													SnapsToDevicePixels="{TemplateBinding SnapsToDevicePixels}"
													Style="{StaticResource SliderVertIncreaseRepeatButtonStyle}"
													Command="Slider.IncreaseLarge"/>
                                            </Track.IncreaseRepeatButton>
                                            <Track.Thumb>
                                                <s:SurfaceThumb  Style="{StaticResource SurfaceSliderVertThumbStyle}"
													Background="{TemplateBinding Background}"
													SnapsToDevicePixels="{TemplateBinding SnapsToDevicePixels}"
													x:Name="Thumb" />
                                            </Track.Thumb>
                                        </Track>
                                    </Grid>
                                    <Canvas ClipToBounds="False">
                                        <Label  x:Name="PART_SurfaceToolTip"
											Style="{StaticResource SliderToolTipStyle}"/>
                                    </Canvas>
                                </Grid>
                                <ControlTemplate.Triggers>
                                    <Trigger Property="IsSelectionRangeEnabled" 
										Value="True">
                                        <Setter Property="Visibility" 
											TargetName="PART_SelectionRange" 
											Value="Visible"/>
                                    </Trigger>
                                    <Trigger Property="TickPlacement"
										Value="TopLeft">
                                        <Setter Property="Visibility"
											Value="Visible"
											TargetName="TopTick"/>
                                    </Trigger>
                                    <Trigger Property="TickPlacement"
										Value="BottomRight">
                                        <Setter Property="Visibility"
											Value="Visible"
											TargetName="BottomTick"/>
                                    </Trigger>
                                    <Trigger Property="TickPlacement"
										Value="Both">
                                        <Setter Property="Visibility"
											Value="Visible"
											TargetName="TopTick"/>
                                        <Setter Property="Visibility"
											Value="Visible"
											TargetName="BottomTick"/>
                                    </Trigger>
                                    <Trigger Property="IsEnabled"
										Value="False">
                                        <Setter Property="Opacity"  
											TargetName="SliderDecrease"                              
											Value="0.25"/>
                                        <Setter Property="Opacity"  
											TargetName="SliderIncrease"                              
											Value="0.5"/>
                                        <Setter Property="Opacity"  
											TargetName="TopTick"                              
											Value="0.25"/>
                                        <Setter Property="Opacity"  
											TargetName="BottomTick"                              
											Value="0.25"/>
                                    </Trigger>
                                </ControlTemplate.Triggers>
                            </ControlTemplate>
                        </Setter.Value>
                    </Setter>
                </Trigger>
            </Style.Triggers>
        </Style>
        <Storyboard x:Key="OnValueChanged1">
            <DoubleAnimationUsingKeyFrames Storyboard.TargetProperty="(RangeBase.Value)" Storyboard.TargetName="surfaceSlider">
                <EasingDoubleKeyFrame KeyTime="0:0:0.5" Value="5"/>
            </DoubleAnimationUsingKeyFrames>
        </Storyboard>

    </UserControl.Resources>

    <UserControl.Triggers>
        <EventTrigger RoutedEvent="RangeBase.ValueChanged" SourceName="surfaceSlider">
            <BeginStoryboard Storyboard="{StaticResource OnValueChanged1}"/>
        </EventTrigger>
    </UserControl.Triggers>

    <Grid>
        <s:SurfaceSlider x:Name="surfaceSlider" Value="5" VerticalAlignment="Center" Style="{DynamicResource SlideSwitch}" ValueChanged="surfaceSlider_ValueChanged"/>
    </Grid>
</UserControl>
